<template>
  <div class="custom-member-tool">
    <el-form :model="form" :rules="rules" ref="ruleForm">
      <el-form-item label="工具标题" :label-width="formLabelWidth" prop="menu_title">
        <el-col :span="8">
          <el-input v-model="form.menu_title" autocomplete="off"></el-input>
        </el-col>
      </el-form-item>
      <el-form-item label="图标地址" :label-width="formLabelWidth">
        <el-col :span="8" class="tl">
          <el-input v-model="form.menu_pic" autocomplete="off"></el-input>
          <uploadpic :piclink="form.menu_pic" :width="150" :height="150" :real_width="80" :real_height="80" :is_more="false" @send_pic="onSuccess"></uploadpic>
        </el-col>
      </el-form-item>
      <el-form-item label="链接地址" :label-width="formLabelWidth" prop="menu_link">
        <el-col :span="8">
          <el-input v-model="form.menu_link" autocomplete="off"></el-input>
        </el-col>
        <el-col :span="1">&nbsp;&nbsp;</el-col>
        <el-col :span="8" class="tl">
          <LinkMenu @sendRow="getSendRow"></LinkMenu>
        </el-col>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="closeDialog">取 消</el-button>
      <el-button type="primary" @click="submitForm('ruleForm')">确 定</el-button>
    </div>
  </div>
</template>

<script>
import LinkMenu from "@/components/currency/Link_menu.vue";
import uploadpic from "@/components/page/pic/up_pic";

export default {
  name: "custom-member-tool",
  props: {
    row: {
      type: Object,
      default: () => {},
    },
    rating: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      form: {
        menu_link: "",
        menu_pic: "",
        menu_title: "",
      },
      formLabelWidth: "120px",
      fileList: [],
      rules: {
        menu_title: [
          { required: true, message: "请输入工具标题", trigger: "blur" },
          { min: 2, max: 5, message: "长度在 2 到 5 个字符", trigger: "blur" },
        ],
      },
    };
  },
  components: {
    LinkMenu,
    uploadpic,
  },
  created() {
    if (this.row.id) {
      this.form = this.row;
    }
  },
  mounted() {},
  methods: {
    closeDialog() {
      this.$emit("hideDio");
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          //   this.$emit('hideDio')
          var params = {};
          params = this.form;
          if (params.id) {
            delete params.update_time;
            delete params.created_time;
            this.$api.getMember.editCustomMemberTool(params).then((res) => {
              if (res.data.code == 200) {
                this.$fnc.alertSuccess({ text: "修改成功" }); //成功弹出框
                this.$emit("updateList");
              } else {
                this.$fnc.alertError(res.data.code_desc, res.data.result); //失败弹出框
              }
            });
          } else {
            params.rating = this.rating;
            this.$api.getMember.addcustomMemberTool(params).then((res) => {
              if (res.data.code == 200) {
                this.$fnc.alertSuccess({ text: "添加成功" }); //成功弹出框
                this.$emit("updateList");
              } else {
                this.$fnc.alertError(res.data.code_desc, res.data.result); //失败弹出框
              }
            });
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    getSendRow(row) {
      console.log(row);

      this.$store.dispatch("getShopsAll", { page: 1, page_size: 10 });
      if (row == null) return false;

      let index = row.index;

      if (!row.disable && row.title == "自定义链接") {
        this.form.menu_link = "";

        return false;
      }

      if (row.url) {
        this.form.menu_link = row.url;
      }

      if (row.url_title == "产品分类" && row.click_title == "供应商分类") {
        this.form.menu_link = "/pages/shop/supplier/supplier?cate=" + row.id;
        return;
      }
      if (row.url_title == "产品分类" && row.click_title != "供应商分类") {
        this.form.menu_link = "/shop/shopsearch?cate_id=" + row.id;
      }
      if (row.url_title == "旅游产品分类") {
        this.form.menu_link = "/tourshop/cate?cate_id=" + row.id;
      }
      if (row.url_title == "插件管理") {
        this.form.menu_link = row.url || "";
      }

      if (row.url_title == "商品选择") {
          this.form.menu_link = "/pages/shop/shopdetail/shopdetail?id=" + row.id;
      }
      if (row.url_title == "文章添加") {
        this.form.menu_link = "/pages/news/newsdetail/newsdetail?news_id=" + row.id;
      }
      if (row.url_title == "资讯分类") {
        this.form.menu_link = "/news?cate_id=" + row.id;
      }
    },
    onSuccess(pic) {
      this.form.menu_pic = pic;
    },
  },
};
</script>
<style lang="less" scoped></style>
